import {Picker, Textarea, View} from "@tarojs/components";
import Taro from "@tarojs/taro";
import {useState} from "react";
import './index.scss'

function Index() {
  //选择器
  const bindPickerChange=(e)=>{
    setIndex(e.target.value)
    setShow(true)
  }
  const [array,setArraty] = useState(['时间冲突','客户要求取消','其他'])
  const [index,setIndex] = useState(-1)
  const [isShow,setShow] = useState(false)

  //点击确定
  const btn = ()=>{
    Taro.navigateBack()
    console.log(text)
  }

  //文本框绑定值
  const [text,setText] =useState('')
  const  inputText =(e)=>{
    setText(e.target.value)
  }
  return (
    <View>
      <View style={{backgroundColor:'#fff',height:'80px',lineHeight:'80px'}}>
        <View className='iconfont icon-xiangzuo' style={{position:'absolute',top:'0',left:'0',fontSize:'22px',paddingTop:'6px',display:'flex'}}
              onClick={()=>Taro.navigateBack()}>
          <View style={{fontSize:'14px',paddingLeft:'4px'}}>拒单</View>
        </View>
        <View style={{textAlign:'center',width:'100%'}}></View>
      </View>
      <View className='box'>
        <View className='top'>
          <View>拒单原因</View>
          <View className='section'>
            <Picker onChange={(e)=>bindPickerChange(e)} value={index} range={array}>
              <View className='picker'>
                <View style={{display:isShow?'none':"block"}}>请选择</View>{array[index]}
              </View>
            </Picker>
          </View>
        </View>
        <View className='title'>拒单说明</View>
        <Textarea className='text' value={text} onInput={(e)=>inputText(e)}></Textarea>
        <View className='btn' onClick={btn}>提交</View>
      </View>
    </View>
  );
}

export default Index;
